<template>
    <div class="xinzeng">
      <h4>新增待转正人员</h4>
      <div class="int">
          <el-form :model="ruleForm" 
          label-width="120px" 
          :rules="rules"
          ref="ruleFormRef"
          status-icon
          >
              <el-form-item label="姓名" prop="name">
                <el-input v-model="ruleForm.name" width="200px"  placeholder="请输入姓名"/>
              </el-form-item>
              <el-form-item label="性别" prop="resource">
                  <el-radio-group v-model="ruleForm.resource">
                    <el-radio label="男" />
                    <el-radio label="女" />
                  </el-radio-group>
                </el-form-item> 
              <el-form-item label="手机号码"  prop="shoujihao">
                  <el-input v-model="ruleForm.shoujihao"  placeholder="请输入手机号"/>
                </el-form-item>
                <el-form-item label="工号"  prop="gonghao">
                  <el-input v-model="ruleForm.gonghao" placeholder="请输入工号"/>
                </el-form-item>
                <el-form-item label="证件号码"  prop="zhengjianbiaohao">
                  <el-input v-model="ruleForm.zhengjianbiaohao"  placeholder="请输入证件号码"/>
                </el-form-item>
              <el-form-item label="岗位"  prop="gangwei">
                <el-select v-model="ruleForm.gangwei" placeholder="请选择岗位">
                  <el-option label="项目经理" value="项目经理" />
                  <el-option label="科室主任" value="科室主任" />
                  <el-option label="副总裁" value="副总裁" />
                </el-select>
              </el-form-item>
              <el-form-item label="部门"  prop="bumen">
                  <el-select v-model="ruleForm.bumen" placeholder="请选择部门">
                    <el-option label="项目部" value="项目部" />
                    <el-option label="产品部" value="产品部" />
                    <el-option label="人力资源部" value="人力资源部" />
                    <el-option label="财务部" value="财务部" />
                    <el-option label="行政部" value="行政部" />
  
                  </el-select>
                </el-form-item>
                <el-form-item label="工作性质"  prop="gongzuoxingzhi">
                  <el-select v-model="ruleForm.gongzuoxingzhi" placeholder="请选择工作性质">
                    <el-option label="正式" value="正式" />
                    <el-option label="试用" value="试用" />
                    <el-option label="实习" value="实习" />
                    <el-option label="兼职" value="兼职" />
                  </el-select>
                </el-form-item>
                <el-form-item label="试用期"  prop="shiyongqi">
                  <el-select v-model="ruleForm.shiyongqi"  placeholder="个月">
                      <el-option label="一个月" value="一个月" />
                      <el-option label="三个月" value="三个月" />
                    </el-select>
                </el-form-item>
                <el-form-item label="状态"  prop="zhuangtai">
                  <el-select v-model="ruleForm.zhuangtai" placeholder="请选择状态">
                    <el-option label="待转正" value="待转正" />
                  </el-select>
                </el-form-item>
              <el-form-item label="入职时间"  prop="ruzhiriqi">
                  <el-date-picker
                  v-model="ruleForm.ruzhiriqi"
                  type="date"
                  placeholder="请选择时间"
                  format="YYYY/MM/DD"
                  value-format="YYYY-MM-DD"
                  style="width:450px"
                />
              </el-form-item> 
              <el-form-item label="转正时间"  prop="zhuanzhenriqi">
                <el-date-picker
                v-model="ruleForm.zhuanzhenriqi"
                type="date"
                placeholder="请选择时间"
                format="YYYY/MM/DD"
                value-format="YYYY-MM-DD"
                style="width:450px"
              />
            </el-form-item>                
              <el-form-item>
                <el-button @click="$router.back()">返回</el-button>
                <el-button type="primary" @click="addrenyuan()">保存</el-button>
              </el-form-item>
            </el-form>
      </div>
    </div>
  </template>
  
  <script setup>
  import { ref } from "vue";
  import * as request from '@/api/biao/biao'
  import{useRouter} from 'vue-router'
  var $router=useRouter()
  var ruleFormRef=ref()
  var ruleForm=ref({
      name:'',
      bumen:'',
      gangwei:'',
      shoujihao:'',
      gonghao:'',
      zhengjianbiaohao:'',
      gongzuoxingzhi:'',
      zhuangtai:'',
      ruzhiriqi:'',
      zhuanzhenriqi:'',      
      shiyongqi:'',
      resource:''
  })
  //数据校验
  var rules=ref({
      name: [
      { required: true, message: '请输入姓名', trigger: 'blur' }, 
    ],
    bumen: [
      { required: true, message: '请选择部门', trigger: 'blur' }, 
    ],
    gangwei: [
      { required: true, message: '请选择岗位', trigger: 'blur' }, 
    ],
    shoujihao: [
      { required: true, message: '请输入手机号码', trigger: 'blur' }, 
    ],
    gonghao: [
      { required: true, message: '请输入工号', trigger: 'blur' }, 
    ],
    zhengjianbiaohao: [
      { required: true, message: '请输入证件号码', trigger: 'blur' }, 
    ],
    gongzuoxingzhi: [
      { required: true, message: '请选择工作性质', trigger: 'blur' }, 
    ],
    zhuangtai: [
      { required: true, message: '请选择状态', trigger: 'blur' }, 
    ],
    ruzhiriqi: [
      { required: true, message: '请选择入职时间', trigger: 'blur' }, 
    ],
    zhuanzhenriqi: [
      { required: true, message: '请选择入职时间', trigger: 'blur' }, 
    ],
  })
  var addrenyuan=async()=>{
      ruleFormRef.value.validate(async (valid) => {
  if(valid){
      var res=await request.xinzhuanzheng_login(ruleForm.value)
  console.log(res);
  ElNotification({
    title: "通知",
    message: "新增人员成功",
    type: "success",
    duration: 2000,
   });
  $router.back()
  }
      } )
  
  }
  
  </script>
  
  <style scoped>
  .xinzeng{
    width: 100%;
  }
  .xinzeng h4{
      display: inline-block;
      width: 100%;
      padding-bottom: 10px;
      border-bottom: 1px solid;
      margin-bottom: 15px;
    }
    .el-input,.el-select{
      width: 450px;
    }
    .el-col{
      width: 450px;
    }
  .int{
      width: 80%;
  }
  .el-button{
      width: 150px;
  }
  </style>